import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex);

const list = [
  {
    color: "#fefefe",
    num: 0
  },
  {
    color: "#9ef088",
    num: 0.1
  },
  {
    color: "#3cb23c",
    num: 1.6
  },
  {
    color: "#62b1fc",
    num: 7
  },
  {
    color: "#2917fc",
    num: 15
  },
  {
    color: "#ed11e8",
    num: 40
  },
  {
    color: "#73033b",
    num: 50
  }
];
const reverseList = list.map(e => e).reverse();

const store = new Vuex.Store({
  state: {
    numStyle: 'caliper', // caliper -- 卡尺式 ， center -- 居中式
    arrayStyle: 'vertical', // vertical -- 竖， horizontal -- 横
    numPosition_vert: 'left', // right, left
    numPosition_hori: 'top', // top, bottom
    width: 20,
    height: 20,
    // datalist: list
  },
  getters: {
    datalist: state => {
      return state.arrayStyle === 'vertical' ? reverseList : list;
    }
  },
  mutations: {
    changeNumStyle (state, numStyle) {
      state.numStyle = numStyle
    },
    changeArrayStyle (state, arrayStyle) {
      state.arrayStyle = arrayStyle
    },
    changeNumPosition_vert (state, numPosition_vert) {
      state.numPosition_vert = numPosition_vert
    },
    changeNumPosition_hori (state, numPosition_hori) {
      state.numPosition_hori = numPosition_hori
    },
    changeWidth (state, width) {
      state.width = width;
    },
    changeHeight (state, height) {
      state.height = height;
    }
  }
})

export default store;